<template>
	<view>
		<view class="u-m-24">
			<view class="u-m-b-30 u-exhibiton-box u-flex u-row-between" @click="onSwitchDetail()">
				<u-image width="150rpx" height="150rpx" :src="data.logo || 'https://6rcj.com/static/images/yigu.jpg'" mode="aspectFill"></u-image>
				<view class="u-flex-1 u-flex-col u-row-between u-col-top u-m-l-20 u-ellipsis" style="height: 150rpx;">
					<view class="u-flex u-row-between u-width-100">
						<view class="u-flex-1 u-font-32 u-ellipsis u-font-bold u-width-100">{{ data.company_name || '请完善公司信息' }}</view>
						<view class="edit_btn" v-if="isPromoter" @click.native.stop="onEditConvention">修改</view>
					</view>
					<view class="u-m-t-10 u-flex u-flex-wrap">
						<view class="u-m-r-10 u-m-b-10 convention_tag u-back-linear"
							v-for="item2 in data.industry_names" :key="item2">{{item2}}</view>
					</view>
					<view class="u-flex u-row-between u-font-24 u-color-gray u-width-100">
						<view class="u-ellipsis u-color-gray">{{ data.address }}</view>
					</view>
				</view>
				
			</view>
			<view v-if="data.swiperList[0]">
				<u-swiper :list="data.swiperList" height="320" border-radius="20" img-mode="aspectFill"
					@click="openSwiper"></u-swiper>
			</view>
			<!-- <view class="u-card-box u-m-t-30 u-flex u-row-between" v-for="item in data.contracts" :key="item.id">
				<u-image width="90rpx" height="90rpx" border-radius="20"
					:src="item.head_img"
					mode="aspectFit"></u-image>
				<view class="u-flex-1 u-flex u-flex-col u-row-between u-col-top u-m-l-20 u-p-t-5 u-p-b-5 u-ellipsis">
					<view class="u-flex">
						<view class="u-font-title u-m-r-10">{{item.username}}</view>
						<view class="u-m-r-10" v-if="item.is_authentication == 2">
							<u-icon size="32" color="#FB6316" name="renzheng" custom-prefix="custom-icon" />
						</view>
						<view class="u-m-r-10" v-if="item.is_company_user == 1">
							<u-icon size="32" color="#F8494D" name="qiye1" custom-prefix="custom-icon" />
						</view>
					</view>
					<view class="u-m-t-10 u-color-gray u-font-24 u-ellipsis u-width-100" v-if="data.company_name">
						{{data.company_name}}</view>
				</view>
			</view> -->
			<!-- 高级展厅样式 -->
			<view v-if="statusData.is_have == 1">
				<view class="u-m-t-40" v-if="statusData.goods[0]">
					<view class="u-font-34 u-font-bold u-m-b-30">商品/服务</view>
					<view class="product">
						<view class="product_box" v-for="item in statusData.goods" :key="item.id"
							@click="onViewGoods(item)">
							<image :src="item.images" mode="aspectFill" />
							<view class="u-p-t-10 u-p-b-10 u-p-l-15 u-p-r-15">
								<view class="u-font-30 u-font-bold u-ellipsis">{{item.name}}</view>
								<view class="u-m-t-10">
									<span class="u-font-24 u-color-red">¥</span>
									<span class="u-font-bold u-color-red"
										style="font-size: 46rpx;">{{item.price}}</span>
									<span class="u-font-26 u-m-l-20 u-color-gray u-font-line">¥</span>
									<span class="u-font-26 u-color-gray u-font-line">{{item.line_price}}</span>
								</view>
							</view>
						</view>
					</view>
				</view>
				<view class="u-m-t-40" v-if="statusData.videos[0]">
					<view class="u-font-34 u-font-bold u-m-b-30">介绍视频</view>
					<view class="video">
						<view class="video_box" v-for="item in statusData.videos" :key="item.id"
							@click="onViewVideo(item)">
							<image class="video_tpic" :src="item.images" alt="" />
							<image class="video_play"
								src="https://lrcj.oss-cn-shenzhen.aliyuncs.com/images/common/20241031549298418032.png"
								mode=""></image>
							<!-- <view class="u-p-t-10 u-p-b-10 u-p-l-20 u-p-r-20">
								<view class="u-font-30 u-font-bold ">优派科技(中国)有限公司企业介绍</view>
							</view> -->
						</view>
					</view>
				</view>
			</view>
			<view class="u-m-t-40" v-if="data.business">
				<view class="u-font-34 u-font-bold u-m-b-20">主营业务</view>
				<view class="u-back-white u-m-t-20 u-p-20 u-radius-20">
					<u-parse :html="data.business" :tag-style="style"></u-parse>
				</view>
			</view>
			<view class="u-m-t-40" v-if="data.detail">
				<view class="u-font-34 u-font-bold u-m-b-20">简介</view>
				<view class="u-back-white u-m-t-20 u-p-20 u-radius-20">
					<u-parse :html="data.detail" :tag-style="style"></u-parse>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		props: {
			data: {
				type: Object
			},
			statusData: {
				type: Object
			},
			// 是否是展厅主
			isPromoter: {
				type: Boolean,
				default: false
			}
		},
		methods: {
			openSwiper(ind) {
				const params = {
					index: ind,
					list: this.data.swiperList
				}
				this.$emit("openSwiper", params)
			},
			onViewGoods(val) {
				uni.navigateToMiniProgram({
					shortLink: val.mini_link
				})
			},
			onViewVideo(val) {
				this.$emit("onViewVideo", val)
			},
			onSwitchDetail() {
				this.$emit("onSwitchDetail", this.statusData.company_id)
			},
			onEditConvention(){
				this.$emit("onEditConvention")
			}
		}
	}
</script>

<style lang="scss" scoped>
	.product {
		display: flex;
		overflow-x: scroll;
		overflow-y: hidden;
		height: 500rpx;
	}

	.edit_btn {
		background: red;
		color: #fff;
		padding: 10rpx 15rpx;
		font-size: 24rpx;
		border-radius: 10rpx;
	}

	.product_box {
		width: 300rpx;
		height: 500rpx;
		background: #fff;
		border-radius: 20rpx;
		margin-right: 30rpx;

		image {
			width: 300rpx;
			height: 360rpx;
			border-top-left-radius: 20rpx;
			border-top-right-radius: 20rpx;
		}
	}

	.video {
		display: flex;
		overflow-x: scroll;
		overflow-y: hidden;
		height: 400rpx;
	}

	.video_box {
		width: 300rpx;
		height: 400rpx;
		background: #fff;
		border-radius: 20rpx;
		margin-right: 30rpx;
		position: relative;

		.video_tpic {
			width: 100%;
			height: 100%;
			border-radius: 20rpx;
		}

		.video_play {
			width: 80rpx;
			height: 80rpx;
			position: absolute;
			top: 40%;
			left: calc(50% - 40rpx);
		}
	}
</style>